{extend name="index/base" /}
{block name="style"}
<style type="text/css">
	.left{}
</style>
{/block}
{block name="body"}
<div class="">  
  <div class="layui-row layui-col-space10">
    <div class="layui-col-lg1 left">
      <ul id="tree"></ul>
    </div>
    <div class="layui-col-lg11">
    	<blockquote class="layui-elem-quote">
			<a href="javascript:;" class="layui-btn layui-btn-sm" id="add" data-url="{:url('add')}">
				<i class="layui-icon">&#xe608;</i> 添加
			</a>
			<button url="{:url('del')}" class="layui-btn layui-btn-sm confirm" lay-submit lay-filter="ajax-post"  target-form="ids" >
				<i class="layui-icon">&#xe640;</i> 删除
			</button>
		</blockquote>
        <table id="tb1" lay-filter="_tb1"></table>
    </div>
  </div>
</div>

{/block}

{block name="script"}
<script src="https://cdn.bootcss.com/clipboard.js/1.7.1/clipboard.min.js"></script>
<script type="text/html" id="check">
	<input type="checkbox" lay-skin="primary" name="ids[]" class="ids" value="{{ d.id }}">
</script>
<script type="text/html" id="bar">
	<div class="layui-btn-group">
	  <a class="layui-btn layui-btn-xs copy" data-clipboard-text="{:config('site.domain')}/detail/{{ d.id }}" data-url="{:config('site.domain')}/detail/{{ d.id }}" >复制链接</a>
	  <a class="layui-btn layui-btn-xs edit" data-url="{:url('edit')}?id={{ d.id }}" >编辑</a>
	  <a class="layui-btn layui-btn-xs confirm_del" data-url="{:url('del')}?ids={{ d.id }}" >删除</a>
	</div>
</script>
<script type="text/html" id="view">
	<span class="layui-text"><a href="javascript:;" data-url="/detail/{{ d.id }}" class="view">{{ d.title }}</a></span>
</script>
<script type="text/javascript">
layui.use(['tool','tree'],function(){
	var $ = layui.$,layer = layui.layer, form = layui.form,table = layui.table,tool = layui.tool;
	//table
	var tableobj = table.render({
		elem:'#tb1',
		url:'{:url('index')}',
		limit:15,
		limits:[10,15,20,50,100],
		page:true,
		//size:'sm',
		method:'get',
		height:'full-100',
		cols:[[
			{title:'<input type=checkbox lay-filter=allChoose lay-skin=primary>',fixed:'left',templet:'#check',width:50},
			{title:'ID',field:'id',width:80},
			{title:'标题',field:'title',templet:'#view'},
			{title:'所属分类',field:'cate_id'},
			{title:'修改时间',field:'update_time'},
			{title:'已阅',field:'read'},
			{title:'操作',fixed: 'right', width:200, align:'center', templet: '#bar'}

		]]
	});
	//tree
	layui.tree({
	  elem: '#tree' //传入元素选择器
	  ,nodes: {$layui_tree|raw}
	  ,click: function(node){
	    reloadtb(node.id);
	  }  
	});
	function reloadtb(id){
		table.reload('tb1', {
		  where: { //设定异步数据接口的额外参数，任意设
		    cate_id: id
		  }
		  ,page: {
		    curr: 1 //重新从第 1 页开始
		  }
		});
	}
	//添加
	$(document).on('click','#add,.edit',function(){
	    var url = $(this).data('url'),title = '添加文章';
	    if($(this).hasClass('edit')){
	      url = $(this).data('url');
	      title = '编辑文章';
	    }
	  	parent.layer.open({
	      title:title,
	      type: 2,
	      area: ['750px', '90%'],
	      fixed: false, //不固定
	      maxmin: true,
	      content: url,
	      shade:0,
	      id:'group_add'
	    });
	});
	//复制文本
	var clipboard = new Clipboard('.copy');
	clipboard.on('success',function(e){
		layer.msg('复制成功');
	});
	clipboard.on('error',function(e) {
		layer.msg('您的浏览器不支持复制功能，请手动复制框内内容');
	});
	//预览
	//添加
	$(document).on('click','.view',function(){
	    var url = $(this).data('url'),title = '预览';
	  	parent.layer.open({
	      title:title,
	      type: 2,
	      area: ['414px', '90%'],
	      fixed: false, //不固定
	      maxmin: true,
	      content: url,
	      shade:0
	    });
	});
});

</script>
{/block}